/**
 * 签章密码弹出框
 */
import "./approveStepReadonly.css"
import React, { useEffect, useRef, useState } from "react";
import {  Input, Modal, Button, Form } from "antd";
import message from "../../framework/common/utils/message";
import request from "../../framework/common/utils/request";
import eventBus, { useSubscribe } from "../../framework/common/eventBus";


export default function({
    showSignModelModal = false,//弹出框显示状态
    handleCancel//父组件取消事件
}){

    const [loading, setLoading] = useState(false);//加载状态
    const [confirmLoading, setConfirmLoading] = useState(false);//弹出框确定按钮状态
    const [passwordvalidateState, setPasswordvalidateState] = useState({});//签章密码反馈状态
    const [form] = Form.useForm();//表单对象

    //其他组件更新本组件内确定按钮loading状态
    useSubscribe("setSignBtnLoading.update", (data)=>{
        if(data !== undefined){
            setConfirmLoading(data);
        }else{//没传data，默认去掉按钮loading状态
            setConfirmLoading(false);
        }
        
    });

    //确定事件
    function handleOk(){
        form.validateFields().then(function(res){
            if(!res?.errorFields?.length){//校验通过
                //校验签章密码
                setConfirmLoading(true);
                request({
                    method: "post",
                    url: '/user/signature/check-sign-pwd',
                    data: res,
                }).then(function(resObj){
                    if (resObj.code == 1) {
                        setPasswordvalidateState({
                            validateStatus: "",
                            help: ""
                        });
                        eventBus.publish("doApprove.update");//发起审批
                    } else {
                        setConfirmLoading(false);
                        setPasswordvalidateState({
                            validateStatus: "error",
                            help: resObj.message
                        });
                    }

                },function(){
                    setConfirmLoading(false);
                    message.info({
                        content: "签章密码验证失败"
                    });
                });
            }            
        }).catch(function(res){
            //footer区校验不通过
        });
    }

    return <Modal
        visible={showSignModelModal}
        title={'签章密码'}
        centered={true}
        width={600}
        onCancel={()=>{
            handleCancel?.();//调用父组件取消事件
        }}
        confirmLoading={confirmLoading}
        keyboard={false}
        maskClosable={false}
        onOk={()=>{
            handleOk()
        }}
    >
        <Form
            name="sign"
            labelAlign="left"
            labelCol={{
                span: 4,
            }}
            colon={false}
            autoComplete="off"
            form={form}
            >
                <div className=" min-h-[240px]">
                    <Form.Item
                        label="签章密码"
                        name="input_pwd"
                        validateStatus={passwordvalidateState.validateStatus}
                        help={passwordvalidateState.help}
                        rules={[
                            {
                                required: true,
                                message: '请输入签章密码。',
                            },
                        ]}
                    >
                        <Input.Password maxLength={6} placeholder="请输入签章密码" />
                    </Form.Item>
                </div>
        </Form>
    </Modal>
}